<template>
  <div :style="'height:' + height">
    <iframe
      id="iframe"
      ref="Iframe"
      :src="url"
      frameborder="no"
      style="width: 100%; height: 100%"
      scrolling="auto"
    />
    <!-- <i-vue-frame
      :src="url"
      id="iframe"
      frame-id="my-ifram"
      name="my-frame"
      width="100%"
      height="100%"
    ></i-vue-frame> -->
  </div>
</template>

<script setup>
const props = defineProps({
  src: {
    type: String,
    required: true,
  },
})
const { proxy } = getCurrentInstance()
const height = ref('')
const url = computed(() => props.src)

let loading = ref(false)

onMounted(() => {
  setStyle()
  window.onresize = () => {
    setStyle()
  }
  //proxy.$fn.initLayout(proxy, { loading })
})
onActivated(() => {
  //proxy.$fn.initLayout(proxy, { loading })
})
function setStyle() {
  height.value = document.documentElement.clientHeight - 60 + 'px;'
}
</script>
